import React, { Component } from 'react'
import { Flex } from 'antd-mobile'

import { getCurrNewsData } from '../../../../network/home'
import { BASE_URL } from '../../../../assets/js/constant'

import './index.scss'
export default class CurrNews extends Component {
  state = { currNewsData: [] }

  componentDidMount() {
    this.getCurrNewsData()
  }

  // 获取最新咨询
  getCurrNewsData = async () => {
    let res = await getCurrNewsData({
      url: '/home/news',
      params: {
        area: 'AREA%7C88cff55c-aaa4-e2e0'
      }
    })
    this.setState({ currNewsData: res.body })
  }

  // 渲染最新咨询
  renderCurrNews = () => {
    return (
      this.state.currNewsData.map(item =>
        <Flex className="news-item" key={item.id}>
          <img src={`${BASE_URL}${item.imgSrc}`} alt="" />
          <Flex className="desc" direction="column" justify="between" align="start">
            <h2 className="title">{item.title}</h2>
            <Flex justify="between" className="origin">
              <span>{item.from}</span>
              <span>{item.date}</span>
            </Flex>
          </Flex>
        </Flex>)
    )
  }
  render() {
    return (
      <div className="curr-news">
        <h3>最新资讯</h3>
        <main>
          {this.renderCurrNews()}
        </main>
      </div>
    )
  }
}
